<%@ page import="java.util.*" %>
<%@ page import="java.util.stream.Stream" %>
<%@ page import="java.util.stream.Collectors" %><%--
  Created by IntelliJ IDEA.
  User: 86138
  Date: 2024/6/5
  Time: 下午7:16
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>餐厅管理系统登录解密</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <%--<link href="back.css" rel="stylesheet" type="text/css" />--%>
    <!-- 引入 layui.css -->
    <link href="//unpkg.com/layui@2.9.11/dist/css/layui.css" rel="stylesheet">
    <!-- 引入 layui.js -->
    <script src="//unpkg.com/layui@2.9.11/dist/layui.js"></script>
    <script src="https://cdn.staticfile.net/Chart.js/3.9.1/chart.js"></script>
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <nav class="navbar navbar-default" role="navigation">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button> <a class="navbar-brand" href="#">管理网站</a>
                </div>
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <form class="navbar-form navbar-left" role="search" method="post" >
                            <div class="form-group">
                                <input type="text" class="form-control" name="dishName" />
                            </div>
                            <button type="button" class="btn btn-default"><a href="Reportform.jsp">返回</a></button>
                        </form>
                    </ul>
                </div>
            </nav>

            <label>总销售额 单位:元</label>

            <div class="text-center">
                <canvas id="SaleAll" width="600" height="600"></canvas>
            </div>
            <%
                Map<String, Integer> map = (Map<String, Integer>) request.getSession().getAttribute("popularDish");
                List<Map.Entry<String,Integer>> list1= (List<Map.Entry<String, Integer>>) request.getSession().getAttribute("popularDishList");
                String[] lab = new String[map.size()];
                String[] data = new String[map.size()];
                int i = 0;
                /*for (Map.Entry<String, Integer> entry : map.entrySet()) {
                    lab[i] = "'"+entry.getKey()+"'";
                    data[i] = "'"+entry.getValue()+"'";
                    i++;
                }*/
                for (Map.Entry<String, Integer> stringIntegerEntry : list1) {
                    lab[i] = "'"+stringIntegerEntry.getKey()+"'";
                    data[i] = "'"+stringIntegerEntry.getValue()+"'";
                    i++;
                }

            %>
            <script>
                const ctx = document.getElementById('SaleAll');
                const data = {
                    labels: <%= Arrays.toString(lab)%>,
                    datasets: [{
                        axis: 'y',
                        label: '流行菜品',
                        data: <%=  Arrays.toString(data) %>,
                        fill: true,
                        backgroundColor: [
                            'rgba(255, 99, 132, 0.2)',
                            'rgba(54, 162, 235, 0.2)',
                            'rgba(255, 206, 86, 0.2)',
                            'rgba(75, 192, 192, 0.2)',
                            'rgba(153, 102, 255, 0.2)',
                            'rgba(255, 159, 64, 0.2)'
                        ],
                        borderColor: [
                            'rgba(255, 99, 132, 1)',
                            'rgba(54, 162, 235, 1)',
                            'rgba(255, 206, 86, 1)',
                            'rgba(75, 192, 192, 1)',
                            'rgba(153, 102, 255, 1)',
                            'rgba(255, 159, 64, 1)'
                        ],
                        borderWidth: 1,
                    }]
                };

                const config = {
                    type: 'bar', // 设置图表类型
                    data: data,  // 设置数据集
                    options: {
                        indexAxis: 'y',
                    }
                };

                const SaleAll = new Chart(ctx, config);
            </script>

        </div>
    </div>
</div>
</body>
</html>
